﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>节点时限设置</title>
    <script src="../Scripts/easyUI145/jquery.min.js" type="text/javascript"></script>
    <script src="../Scripts/config.js" type="text/javascript"></script>
    <script src="../Comm/Gener.js" type="text/javascript"></script>
    <script src="../Scripts/QueryString.js" type="text/javascript"></script>
    <script src="../Scripts/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <link href="../Scripts/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="../Scripts/bootstrap/css/font-awesome.css" rel="stylesheet" type="text/css" />

    <script src="../Scripts/bootstrap/bootstrap-table/src/bootstrap-table.js" type="text/javascript"></script>
    <link href="../Scripts/bootstrap/bootstrap-table/src/bootstrap-table.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/bootstrap/bootstrap-table/src/locale/bootstrap-table-zh-CN.js" type="text/javascript"></script>
    <link href="../Comm/JS/Calendar/skin/WdatePicker.css" rel="stylesheet" type="text/css" />
    <script src="../Comm/JS/Calendar/WdatePicker.js" type="text/javascript"></script>
    <style type="text/css">
        .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th, .table > colgroup + thead > tr:first-child > th {
            border: 1px solid rgb(221, 221, 221);
        }

        body {
            font-size: 12px;
        }
        /*滚动条*/
        ::-webkit-scrollbar-thumb {
            background-color: #b5b5b5;
            height: 50px;
            -webkit-border-radius: 4px;
        }

            ::-webkit-scrollbar-thumb:hover {
                background-color: #585858;
                height: 50px;
                -webkit-border-radius: 4px
            }

        ::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }

        ::-webkit-scrollbar-track-piece {
            background-color: #fff;
            -webkit-border-radius: 4px
        }
    </style>
    <script type="text/javascript">
        var currtab = GetQueryString("CurrTab");
        var fk_node = GetQueryString("FK_Node");
        var fk_flow = GetQueryString("FK_Flow");
        var workid = GetQueryString("WorkID");
        var fid = GetQueryString("FID");
        var webUser = new WebUser();
        var isReadOnly = GetQueryString("IsReadOnly");
       

        $(function () {
            InitPage();
        });

        //初始化数据
        function InitPage() {

            var handler = new HttpHandler("BP.WF.HttpHandler.WF_WorkOpt");
            handler.AddUrlData();
            var data = handler.DoMethodReturnString("CH_Init");
            if (data.indexOf("err@") == 0) {
                alert(data);
                return;
            }

            data = JSON.parse(data);
            var chNodes = data["WF_CHNode"];
            var gwls = data["WF_GenerWorkerList"];
            var node = data.WF_CurrNode[0];
            //流程时限属性
            var gwf = new Entity("BP.WF.GenerWorkFlow");
            gwf.CopyJSON(data.WF_GenerWorkFlow[0]);


            //判断是否可以修改时限
            var chRole = node.CHRole;
            var _Html = "";
            var idx = 0;
            var plantStartDt; // 计划开始时间
            var sdtOfNode; //计划完成时间
            var GS;
            var Pro;
            var limintT;
            for (var i = 0; i < chNodes.length; i++) {
                idx = i + 1;
                var chNode = chNodes[i];
                _Html += "<tr>";
                _Html += "<td>" + idx + "</td>";

                //已经运行过的节点或者运行到的节点
                if (chNode.AtPara != "" && chNode.AtPara != undefined) {
                    _Html += "<td style='text-align: center'>" + chNode.NodeName + "</td>";
                    _Html += "<td style='text-align: center'>" + chNode.FK_EmpT + "</td>";
                    _Html += "<td style='text-align: center'>" + chNode.StartDt + "</td>"; //计划开始
                    _Html += "<td style='text-align: center'>" + chNode.EndDT + "</td>";//计划完成
                    var isPass = GetPara(chNode.AtPara, "IsPass");
                    if (isPass != 1) {
                        _Html += "<td style='text-align: center'><input type='text' id=GT_" + chNode.FK_Node + "' name='GT_" + chNode.FK_Node + "' value='" + chNode.Scale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"GT\")'/></td>";
                        _Html += "<td style='text-align: center'><input type='text' id='Scale_" + chNode.FK_Node + "' name='Scale_" + chNode.FK_Node + "' value='" + chNode.Scale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"Scale\")'/></td>";
                        _Html += "<td style='text-align: center'><input type='text' id='TotalScale_" + chNode.FK_Node + "' name='TotalScale_" + chNode.FK_Node + "' value='" + chNode.TotalScale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"TotalScale\")'/></td>";

                    } else {
                        _Html += "<td style='text-align: center'>" + chNode.GT + "</td>";
                        _Html += "<td style='text-align: center'>" + chNode.Scale + "</td>";
                        _Html += "<td style='text-align: center'>" + chNode.TotalScale + "</td>";
                    }


                    if (chNode.FK_Node == parseInt(fk_flow) + "01") { // 开始节点
                        _Html += "<td style='text-align: center'>无</td>";
                        _Html += "<td style='text-align: center'>正常</td>";
                    } else {
                        //耗时
                        var rdt = GetPara(chNode.AtPara, "RDT");
                        rdt = new Date(Date.parse(rdt.replace(/-/g, "/")));
                        var cdt = GetPara(chNode.AtPara, "CDT");
                        var cdtD = new Date(Date.parse(cdt.replace(/-/g, "/")));

                        _Html += "<td style='text-align: center'>" + GetSpanTime(rdt, cdt) + "</td>";
                        //状态
                        if (cdt <= chNode.EndDT)
                            _Html += "<td style='text-align: center'>正常</td>";
                        else
                            _Html += "<td style='text-align: center'><label style='color:red'>逾期</label></td>";

                    }
                } else { //未运行到的节点
                    if (chNode.FK_Node == parseInt(fk_flow) + "01") { // 开始节点
                        _Html += "<td style='text-align: center'>" + chNode.NodeName + "</td>";
                        _Html += "<td style='text-align: center'>" + webUser.Name + "</td>";
                        _Html += "<td style='text-align: center'>" + new Date().format("yyyy-MM-dd hh:mm") + "</td>";
                        _Html += "<td style='text-align: center'>无</td>";
                        _Html += "<td style='text-align: center'><input type='text' id=GT_" + chNode.FK_Node + "' name='GT_" + chNode.FK_Node + "' value='" + chNode.Scale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"GT\")'/></td>";
                        _Html += "<td style='text-align: center'><input type='text' id='Scale_" + chNode.FK_Node + "' name='Scale_" + chNode.FK_Node + "' value='" + chNode.Scale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"Scale\")'/></td>";
                        _Html += "<td style='text-align: center'><input type='text' id='TotalScale_" + chNode.FK_Node + "' name='TotalScale_" + chNode.FK_Node + "' value='" + chNode.TotalScale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"TotalScale\")'/></td>";

                        _Html += "<td style='text-align: center'>" + new Date().format("yyyy-MM-dd hh:mm") + "</td>";
                        _Html += "<td style='text-align: center'>无</td>";
                        _Html += "<td style='text-align: center'>无</td>";
                        _Html += "<td style='text-align: center'>正常</td>";

                    } else {
                        _Html += "<td style='text-align: center'>" + chNode.NodeName + "</td>";
                        _Html += "<td style='text-align: center'>___</td>";

                        if (isReadOnly == "1") {
                            _Html += "<td style='text-align: center'>" + chNode.StartDT + "</td>";
                            _Html += "<td style='text-align: center'>" + chNode.EndDT + "</td>";
                            _Html += "<td style='text-align: center'>" + chNode.GT + "</td>";
                            _Html += "<td style='text-align: center'>" + chNode.Scale + "</td>";
                            _Html += "<td style='text-align: center'>" + chNode.TotalScale + "</td>";
                        } else {
                            if (chRole == 1||chRole==3 || isReadOnly == "0") {


                                _Html += "<td style='text-align: center'><input type='text'  id='StartDT_" + chNode.FK_Node + "' name='StartDT_" + chNode.FK_Node + "' value='" + chNode.StartDT + "' onfocus='WdatePicker({dateFmt:\"yyyy-MM-dd HH:mm\", onpicked: function (dp) {"
                                    + "$(this).blur(); CompareDate(" + chNode.FK_Node + ",\"StartDT\");}})'  class='form-control Wdate'/></td>";
                                _Html += "<td style='text-align: center'><input type='text' id='EndDT_" + chNode.FK_Node + "' name='EndDT_" + chNode.FK_Node + "' value='" + chNode.EndDT + "' onfocus='WdatePicker({dateFmt:\"yyyy-MM-dd HH:mm\", onpicked: function (dp) {"
                                    + "$(this).blur(); CompareDate(" + chNode.FK_Node + ",\"EndDT\");}})'  class='form-control Wdate'/></td>";
                                _Html += "<td style='text-align: center'><input type='text' id='GT_" + chNode.FK_Node + "' name='GT_" + chNode.FK_Node + "' value='" + chNode.GT + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"GT\")'/></td>";
                                _Html += "<td style='text-align: center'><input type='text' id='Scale_" + chNode.FK_Node + "' name='Scale_" + chNode.FK_Node + "' value='" + chNode.Scale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"Scale\")'/></td>";
                                _Html += "<td style='text-align: center'><input type='text' id='TotalScale_" + chNode.FK_Node + "' name='TotalScale_" + chNode.FK_Node + "' value='" + chNode.TotalScale + "'  class='form-control' onChange='changeStyle(\"" + chNode.FK_Node + "\",\"TotalScale\")'/></td>";

                            } else {
                                _Html += "<td style='text-align: center'>" + chNode.StartDT + "</td>";
                                _Html += "<td style='text-align: center'>" + chNode.EndDT + "</td>";
                                _Html += "<td style='text-align: center'>" + chNode.GT + "</td>";
                                _Html += "<td style='text-align: center'>" + chNode.Scale + "</td>";
                                _Html += "<td style='text-align: center'>" + chNode.TotalScale + "</td>";
                            }
                        }

                        
                        _Html += "<td style='text-align: center'>___</td>";
                        _Html += "<td style='text-align: center'>___</td>";
                        _Html += "<td style='text-align: center'>___</td>";
                        _Html += "<td style='text-align: center'>___</td>";

                        _Html += "</tr>";
                    }
                }

            }

            $("#CHTbody").html(_Html);

            var flow = data.WF_Flow[0];
            if (flow.SDTOfFlowRole != 0) {
                $("#flowTable").hide();
            } else {
                _Html = "<tr>";
                _Html += "<td>" + gwf.RDT + "</td>";

                if (gwf.SDTOfFlow == null || gwf.SDTOfFlow == "" || gwf.SDTOfFlow == undefined) {
                    _Html += "<td>无</td>";
                    _Html += "<td>0秒</td>";
                    _Html += "<td>无</td>";
                } else {
                    _Html += "<td>" + gwf.SDTOfFlow + "</td>";
                    var sdtofFlow = new Date(Date.parse(gwf.SDTOfFlow.replace(/-/g, "/")));
                    if (gwf.SDTOfFlow <= new Date().format("yyyy-MM-dd HH:mm")) {
                        _Html += "<td>-" + GetSpanTime(sdtofFlow, new Date()) + "</td>";
                        _Html += "<td><label style='color:red'>逾期</label></td>";

                    } else {
                        var spanTime = data.SpanTime[0].SpanTime;
                        _Html += "<td>" + spanTime + "</td>";
                        _Html += "<td>正常</td>";
                    }
                }
                if (isReadOnly == "1") {
                    $("#IsChangeDT").hide();
                } else {
                     if (chRole == 3|| isReadOnly == "0")
                        _Html += "<td><input type='text' id='GWF' name='GWF' value='" + gwf.SDTOfFlow + "' onfocus='WdatePicker({dateFmt:\"yyyy-MM-dd HH:mm\"})'  class='form-control Wdate' style='width:150px;display:inline'/></td>";
                    else {
                        $("#IsChangeDT").hide();
                }
                }
               
                _Html += "</tr>";

                $("#FlowCH").html(_Html);

            }

            //可调整时限增加保存按钮
            if (isReadOnly == "1") {

            } else {
                if (chRole == 1||chRole==3  || isReadOnly == "0")
                    $("#bottomBar").append("<input type='button' id='Save' onclick='Save()' value='保存'/>");
            }
            



        }

        function changeStyle(nodeId, type) {
            if (type == "StartDT")
                $("#StartDT_" + nodeId).css("color", "#a7a4a4");
            if (type == "EndDT")
                $("#EndDT_" + nodeId).css("color", "#a7a4a4");
            if (type == "GT")
                $("#GT_" + nodeId).css("color", "#a7a4a4");
            if (type == "Scale")
                $("#Scale_" + nodeId).css("color", "#a7a4a4");
        }

        //比对时间
        function CompareDate(nodeId, type) {
            var startDt = $("#PlantStartDt_" + nodeId).val();
            var endDt = $("#CH_" + nodeId).val();
            if (startDt > endDt) {
                if (type == 0) {
                    alert("计划开始时间不能大于计划完成时间");
                    $("#PlantStartDt_" + nodeId).focus();
                }
                else {
                    alert("计划完成时间不能小于计划开始时间");
                    $("#CH_" + nodeId).focus();
                }
            } else {
                changeStyle(nodeId, type);
            }
            return;
        }

        //保存设置的时限
        function Save() {
            var handler = new HttpHandler("BP.WF.HttpHandler.WF_WorkOpt");
            handler.AddFormData();
            handler.AddUrlData();
            var data = handler.DoMethodReturnString("CH_Save");
            if (data.indexOf("err@") == 0) {
                alert(data);
                return;
            }
            alert("保存成功");
            window.location.href = window.location.href;

        }

        //根据NodeID获取单实体
        function GetEntityByNode(gwls, nodeID) {
            for (var idx = 0; idx < gwls.length; idx++) {
                if (gwls[idx].FK_Node == nodeID)
                    return gwls[idx];
            }
            return null;
        }

        //剩余多少天
        function GetOverSpanTime(date1, date2) {
            //获取当前日期
            var currDate = new Date();
            if (currDate > date2)
                return "0天";
            return GetSpanTime(currDate, date2);

        }
        function GetSpanTime(date1, date2) {
            ///<summary>计算date2-date1的时间差，返回使用“x天x小时x分x秒”形式的字符串表示</summary>
            var date3 = date2.getTime() - date1.getTime();  //时间差秒
            var str = '';
            //计算出相差天数
            var days = Math.floor(date3 / (24 * 3600 * 1000));
            if (days > 0) {
                str += days + '天';
            }

            //计算出小时数
            var leave1 = date3 % (24 * 3600 * 1000);   //计算天数后剩余的毫秒数
            var hours = Math.floor(leave1 / (3600 * 1000));
            if (hours > 0) {
                str += hours + '小时';
            }

            //计算相差分钟数
            var leave2 = leave1 % (3600 * 1000);         //计算小时数后剩余的毫秒数
            var minutes = Math.floor(leave2 / (60 * 1000));
            if (minutes > 0) {
                str += minutes + '分';
            }

            if (str.length == 0) {
                var leave3 = leave2 % (60 * 1000);
                var seconds = Math.floor(leave3 / 1000);

                str += seconds + '秒';

                if (seconds == NaN)
                    return date1 + "," + date2;
                return str;
            }

            return str;
        }

        //时间格式
        Date.prototype.format = function (format) {
            var date = {
                "M+": this.getMonth() + 1,
                "d+": this.getDate(),
                "h+": this.getHours(),
                "m+": this.getMinutes(),
                "s+": this.getSeconds(),
                "q+": Math.floor((this.getMonth() + 3) / 3),
                "S+": this.getMilliseconds()
            };
            if (/(y+)/i.test(format)) {
                format = format.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
            }
            for (var k in date) {
                if (new RegExp("(" + k + ")").test(format)) {
                    format = format.replace(RegExp.$1, RegExp.$1.length == 1
                        ? date[k] : ("00" + date[k]).substr(("" + date[k]).length));
                }
            }
            return format;
        }

    </script>

</head>
<body>
    <div style="padding:12px">
        <form id="cc">
            <div style="height:80%">
                <table class="table table-hover" style="width:100%">
                    <caption>节点时限 </caption>
                    <thead>
                        <tr>
                            <th style='background-color:#F2F2F2;width:10px'>#</th>
                            <th style='background-color:#F2F2F2;text-align:center;width:10%'>节点</th>
                            <th style='background-color:#F2F2F2;text-align:center;width:10%'>处理人</th>
                            <th style='background-color:#F2F2F2;width:160px;text-align:center'>计划开始时间</th>
                            <th style='background-color:#F2F2F2;width:160px;text-align:center'>计划完成时间</th>
                            <th style='background-color:#F2F2F2;width:70px;text-align:center'>工天(天)</th>
                            <th style='background-color:#F2F2F2;width:100px;text-align:center'>阶段占比(%)</th>
                            <th style='background-color:#F2F2F2;width:100px;text-align:center'>总体进度(%)</th>
                            <th style='background-color:#F2F2F2;width:120px;text-align:center'>任务到达时间</th>
                            <th style='background-color:#F2F2F2;width:120px;text-align:center'>实际完成时间</th>
                            <th style='background-color:#F2F2F2;width:70px;text-align:center'> 耗时 </th>
                            <th style='background-color:#F2F2F2;width:50px;text-align:center'>状态</th>
                        </tr>
                    </thead>
                    <tbody id="CHTbody"></tbody>

                </table>
            </div>
            <table class="table" id="flowTable">
                <caption>流程时限 </caption>
                <thead>
                    <tr>
                        <th style='background-color:#F2F2F2;'>开始日期</th>
                        <th style='background-color:#F2F2F2;'>应完成日期</th>
                        <th style='background-color:#F2F2F2;width:150px'>剩余时间</th>
                        <th style='background-color:#F2F2F2;width:150px'>状态</th>
                        <th style='background-color:#F2F2F2;width:150px' id="IsChangeDT">调整时间</th>

                    </tr>
                </thead>
                <tbody id="FlowCH"></tbody>

            </table>
        </form>

        <div id="bottomBar"></div>

    </div>

</body>
</html>
